<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0">
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="../../css/style.css"/>
<script type="text/javascript" src="../../js/common.js"></script>
<link href="../../css/loaders.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="../../js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="../../js/iscroll.js"></script>
<script type="text/javascript" src="../../js/startmove.js"></script>
<script type="text/javascript" src="../../js/MinAjax.js"></script>
<title>网络设置</title>
</head>
<body>
<div class="container-fluid" style="margin-bottom:7rem;">
	<div class="row set-top">
		<div class="col-xs-6">
			<a href="index.html" class="active">网络设置</a>
		</div>
		<div class="col-xs-6">
			<a href="local.html">本地设置</a>
		</div>
	</div>
	<div class="row" id="wrapper">
	<div class="row set-adress scroll" id="address">
		<div class="cols-row">
			<a href="__URL__/index/?sid={$ser['aid']}" class="active">{$ser['name']}</a>
		</div>
	</div>
		</div>
	<div class="row set-line" id="net_line">

	</div>
	<div class="loder">
		<div class="loader-inner ball-spin-fade-loader" style="padding-top: 40px; margin: 0 auto">
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
		</div>
	</div>
	<div class="set-operation">
		<div class="col-xs-12 prompt">

			查询中……

		</div>
		<div class="col-xs-4 col-xs-offset-1 bot">
			<button onclick="window.location.reload()">刷新列表</button>
		</div>
		<div class="col-xs-4 col-xs-offset-2 bot" id="setConnect">
			<input type="hidden" value="0" id="line">
			<if condition="$linkStatus['data']['status']">

			<else />

			</if>
		</div>
	</div>
	<footer>
		<div class="col-xs-3 col-xs-offset-2">
			<a href="../index/index.html" class="btn_1"></a>
		</div>
		<div class="col-xs-3">
			<a href="../game/index.html" class="btn_2"></a>
		</div>
		<div class="col-xs-3">
			<a href="index.html" class="btn_3_yes"></a>
		</div>
	</footer>
</div>
</body>
</html>
<script type="text/javascript">
	var address = document.getElementById('address');
	var colsRrow = document.getElementsByClassName('cols-row');
	address.style.width = 1150.32+'px';
	var Scroll = new iScroll('wrapper',{hScrollbar:false, vScrollbar:false});
	var flag = "";
	load();
	function load(data){
		var url = "http://aaa.57810.mom/index.php/Set/index";
		if (data==''){
			data = '';
		}else{
			data = {gtype:data};
		}
		$.ajax({
			type : "get",
			url : url,
			dataType : "jsonp",
			data:data,
			jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
			jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
			success : function(json){
				var address = document.getElementById("address");
				var net_line = document.getElementById("net_line");
				var prompt = document.getElementsByClassName("prompt")[0];
				var setConnect = document.getElementById("setConnect");
                var addressHtml = '';
				for (var i=0;i<json['server'].length;i++){
					if(i==0){
					    addressHtml+='<div class="cols-row"><a href="javascript:;" onclick="" class="active" >'+json['server'][i]['name']+'</a></div>';
					}else{
						addressHtml+='<div class="cols-row"><a href="javascript:;" onclick="" >'+json['server'][i]['name']+'</a></div>';
					}
				}
				var netLine = '';
				for (var i=0;i<json['serverlist'].length;i++){
					if(i==0){
						netLine+='<div class="col-xs-12 active-index" lineid="{$list->Id}"><a href="javascrript:;" >'+json['serverlist'][i]['Name']+'</a></div>';
					}else{
						netLine+='<div class="col-xs-12" lineid="{$list->Id}"><a href="javascrript:;" >'+json['serverlist'][i]['Name']+'</a></div>';
					}
				}
				if(json['linkStatus']['code']==200){
                    if(json['linkStatus']['data']['status']==true){
						 prompt.innerHTML = '您当前连接的是 '+json['linkStatus']['data']['lineArea']+ +json['linkStatus']['data']['linename']
                         setConnect.innerHTML = "<button onclick='breakLink()'>断开连接</button>"
					}else{
						 prompt.innerHTML = "您未连接任何VPN";
						 setConnect.innerHTML = "<button onclick='startDial(this)'>开始连接</button>"
					}
				}else {
					prompt.innerHTML = "服务器错误！"
				}
				console.log(json)
				address.innerHTML = addressHtml;
				net_line.innerHTML = netLine;
				flag = json['flag'];
				setClick();
			},
			error:function(){
				alert('fail');
			}
		});
	}
    var line = document.getElementById('line');

	function setClick() {
		var set_line = document.getElementsByClassName('set-line')[0].getElementsByTagName('div');
		for (var i = 0; i < set_line.length; i++) {
			set_line[i].onclick = function () {
				for (var j = 0; j < set_line.length; j++) {
					set_line[j].className = 'col-xs-12';
				}
				this.className = "col-xs-12 active-index";
				$lineId = this.getAttribute('lineid');
				line.value = $lineId;
			}
		}
	}
    var index = 1;
	//检测滚动条是否滚动到底了
	$(window).scroll(function(){
		var scrollTop = $(this).scrollTop();
		var scrollHeight = $(document).height();
		var windowHeight = $(this).height();
		var loder = $('.loder');
		if(scrollTop + windowHeight == scrollHeight){
		       loder.show();
			   severUrl = 'http://aaa.57810.mom/index.php/Set/getServerList';
			   data = {index:index,key:flag};
			   $.ajax({
				type : "get",
				url : severUrl,
				dataType : "jsonp",
				data:data,
				jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
				jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
				success : function(json){
					    console.log(json);
					    if (json==''){
						    loder.html("亲，已经触及我的底线了");
							loder.attr("class","loder loderEnd");
							loder.show();
						}else {
							var setlin = document.getElementsByClassName('set-line')[0];
							var html = ''
							for (var i = 0; i < json.length; i++) {
								html += "<div class='col-xs-12' lineid=" + json[i]['Id'] + "><a href='javascript:;'>" + json[i]['Name'] + "</a></div>";
							}
							setlin.innerHTML += html;
							setClick();
							index++;
							loder.hide();
						}

				   },
				   error:function(){
					   alert('fail');
				   }
			   })
		}
	});

	//创建提示框
	function creatLayout(Html){
		var Layout = document.createElement('div');
		Layout.className = 'code_tips';
		Layout.innerHTML = Html;
		document.body.appendChild(Layout);
		Move(Layout,'opacity',100);
		setTimeout(function(){
			Move(Layout,'opacity',0);
			setTimeout(function(){
				document.body.removeChild(Layout);
			},500)
		},1000)
	}

	// 断开连接
	function breakLink(){
		 var breakUrl = "http://aaa.57810.mom/index.php/Set/BreakLinks";
		 $.ajax({
			type : "get",
			url : breakUrl,
			dataType : "jsonp",
			data:data,
			jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
			jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
			success:function(json){
				  console.log(json);
				  if(json['Result']=='succeed'){
					      window.location.reload();
				  }
			 }
		 })
	}

	// 开始拨号
	function startDial(obj){
         var serverId = line.value;
		 var _this = obj;
		 var dialUrl = "http://aaa.57810.mom/index.php/Set/dial";
		 if(serverId==0){
			   creatLayout('请先选择线路');
			   return;
		 }
		data = {sid:serverId};
		$.ajax({
			type : "get",
			url : dialUrl,
			dataType : "jsonp",
			data:data,
			jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
			jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
			success:function(json){
				 console.log(json);
                 if (json['code'] == 200){
					 _this.innerHTML = '正在拨号…………';
					 _this.setAttribute('onclick',null);
					 adlistenStatus();
				 }else{
					 creatLayout('拨号错误');
					 return;
				 }
			 }
		 })
	}

	adlistenStatus();
	//监听拨号状态
	function adlistenStatus(){
		 var timer = null;
		 timer = setInterval(function () {
			   listenUrl = "http://aaa.57810.mom/index.php/Set/returnListen";
			  $.ajax({
				 type : "get",
				 url : listenUrl,
				 dataType : "jsonp",
				 data:"{}",
				 jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
				 jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
				 success:function(json){
					    console.log(json);
					    if(json['Result']=='succeed'){
							   $res = json['Payload'];
							   if($res['Connected']==false){

							   }else{
								    clearInterval(timer);
                                    window.location.reload();
							   }
						}else{
							  alert('错误');
						}
				   }
			   })
		 },5000)
	}
</script>